@{layout('')}

<!DOCTYPE html>
<html>
<head>
	<title>@(Admin v@{config.version})</title>
	<meta charset="utf-8" />
	<meta http-equiv="X-UA-Compatible" content="IE=10" />
	<meta name="format-detection" content="telephone=no" />
	<meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no" />
	<meta name="robots" content="all,follow" />
	<link rel="stylesheet" href="//cdn.componentator.com/spa.min@14.css" />
	<script src="//cdn.componentator.com/spa.min@14.js"></script>
	@{import('head', '/admin.css', '/admin.js', 'favicon.ico')}
</head>
<body data-jc="exec,binder">

	@{json(user, 'userprofile', (k,v) => k === 'password' ? undefined : v)}

	<div data-jc="calendar" data-jc-config="days:@(SU,MO,TU,WE,TH,FR,SO);months:@(January,February,March,April,May,June,July,August,September,October,November,December);today:@(Set date to today);firstday:0"></div>
	<div data-jc="confirm"></div>
	<div data-jc="contextmenu"></div>
	<div data-jc="loading" class="hidden"></div>
	<div data-jc="snackbar" data-jc-config="button:@(Close);timeout:4500"></div>
	<div data-jc="suggestion" data-jc-config="placeholder:@(Search)"></div>
	<div data-jc="mainprogress" data-jc-path="common.progress"></div>
	<div data-jc="websocket" data-jc-config="reconnect:5000;url:[url]live/"></div>
	<div data-jc="shortcuts"></div>
	<div data-jc="features" data-jc-config="placeholder:@(Search ...)"></div>
	<div data-jc="autocomplete"></div>

	<header>
		<nav>
			<a href="/" title="@{'%name'}" target="_blank"><i class="fa fa-globe"></i></a>
			<button class="navigation"><i class="fa fa-navicon"></i>@(Options)</button>
		</nav>
		<div class="title"></div>
		<div class="user hidden-xs">
			<i class="fa fa-circle"></i><span data-b="user.name" data-b-html="value"></span>
		</div>
		<div class="header-message">
			<i class="fa fa-bell"></i>
			<div>
				<div class="header-message-table">
					<div class="header-message-cell"></div>
				</div>
			</div>
		</div>
	</header>
	<div class="header-empty"></div>

	<div data-jc="sitemap" data-jc-path="common.page">
		<script type="application/json">
			[
				{ "role": "Dashboard", "title": "@(Dashboard)", "if": "dashboard", "template": "/admin/templates/dashboard.html", "route": "@{sitemap_url('admin')}dashboard/", "reload": "Dashboard/reload", "icon": "dashboard", "hidden": "Dashboard/hidden" },
				{ "role": "Orders", "title": "@(Orders)", "if": "orders", "template": "/admin/templates/orders.html", "route": "@{sitemap_url('admin')}orders/", "reload": "Orders/reload", "icon": "shopping-cart" },
				{ "role": "Products", "title": "@(Products)", "if": "products", "template": "/admin/templates/products.html", "route": "@{sitemap_url('admin')}products/", "reload": "Products/reload", "icon": "dropbox" },
				{ "role": "Posts", "title": "@(Posts)", "if": "posts", "template": "/admin/templates/posts.html", "route": "@{sitemap_url('admin')}posts/", "reload": "Posts/reload", "icon": "newspaper-o" },
				{ "role": "Notices", "title": "@(Notices)", "if": "notices", "template": "/admin/templates/notices.html", "route": "@{sitemap_url('admin')}notices/", "reload": "Notices/reload", "icon": "bullhorn" },
				{ "role": "Pages", "title": "@(Pages)", "if": "pages", "template": "/admin/templates/pages.html", "route": "@{sitemap_url('admin')}pages/", "reload": "Pages/reload", "icon": "file-text-o" },
				{ "role": "Widgets", "title": "@(Widgets)", "if": "widgets", "template": "/admin/templates/widgets.html", "route": "@{sitemap_url('admin')}widgets/", "reload": "Widgets/reload", "icon": "plug" },
				{ "role": "Users", "title": "@(Users)", "if": "users", "template": "/admin/templates/users.html", "route": "@{sitemap_url('admin')}users/", "reload": "Users/reload", "icon": "users" },
				{ "role": "Newsletters", "title": "@(Newsletters)", "if": "newsletters", "template": "/admin/templates/newsletters.html", "route": "@{sitemap_url('admin')}newsletters/", "reload": "Newsletters/reload", "icon": "envelope-o" },
				{ "role": "Subscribers", "title": "@(Subscribers)", "if": "subscribers", "template": "/admin/templates/subscribers.html", "route": "@{sitemap_url('admin')}subscribers/", "reload": "Subscribers/reload", "icon": "address-book-o" },
				{ "role": "Settings", "title": "@(Settings)", "if": "settings", "template": "/admin/templates/settings.html", "route": "@{sitemap_url('admin')}settings/", "reload": "Settings/reload", "icon": "cog" }
			]
		</script>
	</div>

	<div data-jc="importer" data-jc-path="common.form3" data-jc-config="if:filebrowser;url:[url]forms/filebrowser.html"></div>
	<div data-jc="importer" data-jc-path="common.form" data-jc-config="if:widgets-globals;url:[url]forms/widgets-globals.html"></div>
	<div data-jc="importer" data-jc-path="common.form" data-jc-config="if:pages-globals;url:[url]forms/pages-globals.html"></div>

	<script>

		var filebrowser = {};
		var common = { title: document.title };
		var user = PARSE($('#userprofile').html());

		ENV('url', '@{sitemap_url('admin')}');
		ENV('roles', 'Dashboard,Newsletters,Notices,Orders,Pages,Posts,Products,Settings,Subscribers,Users,Widgets');

		common.elements = VIRTUALIZE($('body'), { title: 'header .title' });
		common.notifications = {};
		common.notifications.ui = VIRTUALIZE($('.header-message'), { icon: '> .fa', body: '.header-message-cell' });
		common.notifications.messages = []; // messages from notifications
		common.notifications.running = false;
		common.notifications.template = '<b>{0}</b><br />{1}';

		// Navigation
		common.page = '';
		common.form = '';
		common.form2 = ''; // Form 2nd level
		common.form3 = ''; // Form 3nd level

		ROUTE('[url]', function() {
			FIND('sitemap', function(com) {
				var items = com.items;
				for (var i = 0, length = items.length; i < length; i++) {
					var item = items[i];
					if (user.sa || !user.roles.length || (user.roles.indexOf(item.role) !== -1)) {
						REDIRECT(item.route);
						break;
					}
				}
			});
		});

		ON('page', function(item) {
			common.elements.title.html('<i class="fa fa-{0}"></i>{1}'.format(item.icon, item.title));
			document.title = common.title + ': ' + item.title;
			setTimeout(refresh_height, 500);
		});

		$(document).on('click', '.navigation', function() {

			var items = [];

			FIND('sitemap').items.forEach(function(item) {
				(user.sa || !user.roles.length || user.roles.indexOf(item.role) !== -1) && items.push({ name: item.title, icon: item.icon, url: item.route });
			});

			items.push({ name: '@(Sign out)', icon: 'power-off', signout: true });

			SETTER('contextmenu', 'show', 'left', $(this), items, function(item) {
				if (item.signout) {
					MAIN.cookies.rem('@{'%admin-cookie'}');
					location.reload(true);
				} else
					REDIRECT(item.url);
			}, 8, 5);

		});

		Tangular.register('time', function(value) {

			if (!value)
				return;

			var diff = Date.now() - value.parseDate().getTime();
			var minutes = ((diff / 1000) / 60) >> 0;

			if (minutes <= 1) {
				var seconds = (diff / 1000) >> 0;
				if (seconds < 60)
					return @(seconds + ' ' + Tangular.helpers.pluralize(seconds >> 0, 'seconds', 'second', 'seconds', 'seconds') + ' ago');
			}

			if (minutes < 60)
				return minutes < 3 ? '@(now)' : @(minutes + ' minutes ago');

			var hours = (minutes / 60) >> 0;
			if (hours < 24)
				return @(hours + ' ' + Tangular.helpers.pluralize(hours, 'hours', 'hour', 'hours', 'hours') + ' ago');

			var days = (hours / 24) >> 0;
			if (days < 30)
				return @(days + ' ' + Tangular.helpers.pluralize(days, 'days', 'day', 'days', 'days') + ' ago');

			var months = (days / 29) >> 0;
			if (months < 12)
				return @(months + ' ' + Tangular.helpers.pluralize(months, 'months', 'month', 'months', 'months') + ' ago');

			var years = (months / 12) >> 0;
			return @(years + ' ' + Tangular.helpers.pluralize(years, 'years', 'year', 'years', 'years') + ' ago');
		});

		ON('message', function(message) {
			if (message.type === 'visitor') {
				EMIT('visitor', message.message);
			} else {
				common.notifications.messages.push(message);
				!common.notifications.running && refresh_notifications();
			}
		});

		ON('online', function(is) {
			$('.user .fa').tclass('green', is).tclass('red', !is);
		});

		function refresh_notifications() {
			var item = common.notifications.messages.shift();

			if (item === undefined) {
				common.notifications.ui.rclass('header-message-visible');
				common.notifications.running = false;
				return;
			}

			var msg = '';
			var t = common.notifications.template;

			switch (item.type) {
				case 'products.save':
					msg = t.format('@(Product has been saved)', item.message);
					break;
				case 'navigation.save':
					msg = t.format('@(Navigation has been saved)', item.message);
					break;
				case 'products.replace-category':
					msg = t.format('@(Category has been replaced)', item.message);
					break;
				case 'products.replace-manufacturer':
					msg = t.format('@(Manufacturer has been replaced)', item.message);
					break;
				case 'products.import':
					msg = t.format('@(Importing has been finished)', '@(Imported: {0}x products)'.format(item.message));
					break;
				case 'newsletters.save':
					msg = t.format('@(Nesletter has been saved)', item.message);
					break;
				case 'newsletters.percentage':
					msg = t.format('@(Sending of newsletter)', '@(Sent: {0}%)'.format(item.message));
					break;
				case 'newsletters.sent':
					msg = t.format('@(Newsletter has been sent)', item.message);
					break;
				case 'subscribers.save':
					msg = t.format('@(Subscriber has been saved)', item.message);
					break;
				case 'subscribers.unsubscribe':
					msg = t.format('@(Unsubscribed)', item.message);
					break;
				case 'files.clear':
					msg = t.format('@(Useless files have been removed)', '@(Count of files: {0}x)'.format(item.message));
					common.form3 === 'filebrowser' && EXEC('filebrowser_refresh');
					break;
				case 'orders.save':
					msg = t.format('@(Order has been saved)', item.message);
					break;
				case 'orders.create':
					msg = t.format('@(New order has been created)', item.message);
					break;
				case 'contacts.create':
					msg = t.format('@(New contact form received)', '@(From: {0})'.format(item.message));
					break;
				case 'pages.save':
					msg = t.format('@(Page has been saved)', item.message);
					break;
				case 'posts.save':
					msg = t.format('@(Post has been saved)', item.message);
					break;
				case 'notices.save':
					msg = t.format('@(Notice has been saved)', item.message);
					break;
				case 'widgets.save':
					msg = t.format('@(Widget has been saved)', item.message);
					break;
				case 'users.save':
					msg = t.format('@(User has been saved)', item.message);
					break;
				case 'users.create':
					msg = t.format('@(New user has been registered)', item.message);
					break;
				case 'users.update':
					msg = t.format('@(Account has been updated)', item.message);
					break;
				case 'users.login':
					msg = t.format('@(User has been logged)', item.message);
					break;
				case 'admin.login':
					msg = t.format('@(Administrator has been logged)', item.message);
					break;
				case 'settings.save':
					msg = '@(Settings have been updated.)';
					break;
			}

			if (msg) {
				!common.notifications.running && common.notifications.ui.aclass('header-message-visible');
				common.notifications.running = true;
				msg && common.notifications.ui.body.html(msg);
			}

			setTimeout(refresh_notifications, item.delay || 3000);
		}

		SETTER(true, 'shortcuts', 'register', 'ESC', function() {
			if (window.cmseditor && cmseditor.form)
				SET('cmseditor.form', '');
			else if (common.form3)
				SET('common.form3', '');
			else if (common.form2)
				SET('common.form2', '');
			else if (common.form) {
				switch (common.form) {
					case 'pages-form':
					case 'products-form':
					case 'newsletters-form':
					case 'widgets-form':
					case 'notices-form':
					case 'posts-form':
						var fields = MODIFIED(common.page + '.form').join(',');
						if (fields.indexOf('.body') !== -1) {
							SETTER('confirm', 'show', '@(Are you sure you want to close this form without saving?)', ['@(Yes)', '@(Cancel)'], function(index) {
								!index && SET('common.form', '');
							});
							return;
						}
						break;
				}
				SET('common.form', '');
			}
		});

		SETTER(true, 'shortcuts', 'register', 'F1', function(e) {

			var items = [];

			FIND('sitemap').items.forEach(function(item) {
				(user.sa || !user.roles.length || user.roles.indexOf(item.role) !== -1) && items.push({ name: item.title, icon: item.icon, url: item.route });
			});

			items.push({ name: '@(Sign out)', icon: 'power-off', signout: true });

			SETTER('features', 'show', items, function(item) {
				if (item.signout) {
					MAIN.cookies.rem('@{'%admin-cookie'}');
					location.reload(true);
				} else {
					window.cmseditor && cmseditor.form && SET('cmseditor.form', '');
					common.form3 && SET('common.form3', '');
					common.form2 && SET('common.form2', '');
					common.form && SET('common.form', '');
					REDIRECT(item.url);
				}
			}, true);
		}, true);

	</script>

</body>
</html>